import {createAppContainer} from 'react-navigation'
import {createBottomTabNavigator} from 'react-navigation-tabs'
import React from 'react'

import HomePage from '../Pages/HomePage'
import DetailPage from '../Pages/DetailPage'

import FontAwesome from 'react-native-vector-icons/FontAwesome'
import MyIcon from 'react-native-vector-icons/MyIcon'

const BottomTabNavigator = createBottomTabNavigator({
    HomePage: {
        screen: HomePage,
        navigationOptions: {
            tabBarLabel: '首页',
            tabBarIcon: <MyIcon
                name="wechat"
                color="#e33293"
                size={26}
            />
        }
    },
    DetailPage: {
        screen: DetailPage,
        navigationOptions: {
            tabBarLabel: '详情',
            tabBarIcon: ({tintColor, focused}) => {
                return <FontAwesome name={focused ? "list-alt" : 'home'} size={26} color={tintColor}></FontAwesome>
            }
        }
    }
})

export default createAppContainer(BottomTabNavigator)